<template>
	<el-dialog :visible.sync="addVisible" @close="$emit('update:addVisible',false)" width="70%" :show-close='false' :append-to-body = "true" class="titrationDialog" :closeOnClickModal='false'>
        <span slot="title" class="dialog-title">
            标定结果
            <el-button size="mini"  @click="close"  class="popupClose">关闭</el-button>
			
        </span>
		<div style = "height:100%;">
			<el-table :data="titrationData.listVal"  size="mini"  style = "width: 100%;" :height = "tableHeight" class = "tableCon" :show-summary="true" :summary-method="getSummaries">
				<el-table-column label="序号" min-width="50px" >
					<template slot-scope="scope" >
						{{scope.$index+1}}
					</template>
				</el-table-column>
				<el-table-column label="样品编号" min-width="120px" prop = "sampleCode" >
				</el-table-column>
				<template v-for="(col,index) in titrationData.listAnal" >
					<el-table-column :label="col.name" :prop="col.id"  :key="index" min-width= "120px">
						<el-table-column :label="col.unitName == undefined ? '---' : col.unitName" min-width="160px" :prop="col.id" :index = " col.type">
                            <template slot-scope="scope">
								{{scope.row[col.id]}}
							</template>
					 	</el-table-column>
					</el-table-column>
				</template>
			</el-table>
		</div>
	</el-dialog>	
</template>

<script>
	import $ from 'jquery'
	import { mapState } from 'vuex'

	export default {
		data() {
			return {
				titrationVal:{},
				enterFlag: false,
				average:0,
				showSum:false,
			

			}
		},
		watch: {
			
		},
		props: ['addVisible','testEntryData','titrationData'],
		components: {

		},
		mounted() {
			console.log(this.testEntryData)
		},
		computed: {
			...mapState(['tableHeightA']),
			tableHeight(){
				return ((window.innerHeight * 0.8) - 100) + 'px'
			}
			
		},
		watch:{
			addVisible(val){
				if(val){
					// for(var i in this.testEntryData){
					// 	if (this.testEntryData[i].formulaAlias != undefined && rthis.testEntryData[i].formulaAlias != null && this.testEntryData[i].formulaAlias != '') {
					// 		var value = res.data[i].formulaAlias.replace(/{/g, '');
					// 		value = value.replace(/}/g, '');
					// 		value = value.replace(/,/g, '');
					// 		// res.data[i].formulaAlias = value;
					// 		this.$set(res.data[i],'formulaName',value)
					// 	}
					// }
				}
			},
		},
		methods: {
			close(){
				// this.titrationData = [];
				this.$emit('update:addVisible', false);
			},
			getSummaries(param) {
				const { columns, data } = param;
				const sums = [];
				columns.forEach((column, index) => {
					if (index === 0) {
						sums[index] = '平均值';
						return;
					}
					if (index === 1) {
						sums[index] = '---';
						return;
					}
					const values = data.map(item => Number(item[column.property]));
					if (column.index == 4 && !values.every(value => isNaN(value))) {
						sums[index] = values.reduce((prev, curr) => {
							const value = Number(curr);
							if (!isNaN(value)) {
								return prev + curr;
							} else {
								return prev;
							}
						}, 0);
						
						sums[index] = this.titrationData.avg
						
					} else {
						sums[index] = '---';
					}
				});
				return sums;
			},

			
			
		}
	}

</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style>
	.titrationDialog .el-dialog {
		margin-top: 10vh !important;
		height: 80%;
	}
/*
	.titrationDialog .el-dialog__body {
		height: calc(100% - 75px);
		overflow-y: auto;
	}*/

	.titrationDialog .el-dialog .el-dialog__body {
		height: calc(100% - 85px);
		padding: 10px;
		overflow-y: auto;
	}
	.titrationDialog .el-table{
		overflow: auto !important;
	}
	.titrationDialog .el-table__fixed-body-wrapper{
		top:68px !important;
	}
	.titrationDialog .tableCon .el-table__body-wrapper{
		height: calc(100% - 105px) !important;
	}
	.titrationDialog .tableCon.el-table td {
		padding: 6px !important;
	}

</style>